<template>
	<view style="width: 100%; height: 90vh;display: flex; flex-direction: column;">
		
		<view class="bag_num">
			包裹
		</view>
		<view class="bag_img"  style="display: flex; justify-content: space-between;">
			 <u-image style="margin-right: 16rpx;" width="120rpx" height="120rpx" border-radius="10rpx" :src="data.pic"></u-image>
			<view class="" style="display: flex; flex-direction: column; justify-content: space-between;flex:1; margin-left: 25rpx;">
				<span style="font-size: 26rpx;">{{`${data.goods_name}-${data.sku}`}}</span>
				<span style="font-size: 24rpx; color: #ccc;">x{{`${data.num}`}}</span>
				<span style="color: orangered; font-weight: 600;">JPY {{`${data.sum_price}`}}</span>
			</view>
		</view>
		<view class="bag_num flex_class">
			<span class="bag_title2">
				<span style="margin-right:8rpx ;">
					运单编号：{{data.express_code?data.express_code:'暂无'}}
				</span>
				<u-icon v-if="data.express_code" @click="copy(data.express_code)" name="cut" color="#8f8f8f" size="28"></u-icon>
			</span>
			
		</view>
		<view class="bag_num bag_top flex_class">
			<span class="bag_title">物流跟踪：</span>
			<view v-if="order_key.length<=0" class="">
				<span class="bag_title2">暂无物流信息</span>
			</view>
			<view v-else class="">
				<view  v-for="(item,index) in order_key" :key="index" class="" style="display: flex; flex-direction: column;">
					<span class="bag_title2" style="color: #333;">● {{item.context}}</span>
					<span class="bag_title2" style="margin-top: 8rpx; margin-bottom: 16rpx;">{{item.time}}</span>
				</view>
				
			</view>
			
		</view>
		<kefu class="" ></kefu>
	</view>
</template>

<script>
	import kefu from '@/componts/kefu/kefu.vue';
	export default {
		components:{
			kefu
		},
		data() {
			return {
				order_id:'',
				order_info:{},
				order_key:[],
				data:{}
			}
		},
		onLoad(e) {
			this.goods_order_spec_id = e.goods_order_spec_id
			this.data = JSON.parse(e.data)
			console.log(this.data , '详情')
			this.getInfo(e.goods_order_spec_id)
		},
		onShow() {},
		methods: {
			getInfo(id){
				var data = {
					"goods_order_spec_id": id,
					"type": 1 
				}
				this.$wqzApi.trajectory(data).then(res=>{
					this.order_key = res.data.data
				})
				var data2 = {
					"id": id,
				}
				// this.$wqzApi.shop_order_detail(data2).then(res=>{
				// 	console.log(res.data)
				// 	this.order_info = res.data
				// })
			},
			pic_one(pic){
				var arr = pic.split(',')
				return arr[0]
			},
			copy(text){
				uni.setClipboardData({
				    data: text,
				    success: function () {
				        uni.showToast({
				            title: '复制成功',
				            icon: 'none'
				        });
				    },
				    fail: function () {
				        uni.showToast({
				            title: '复制失败',
				            icon: 'none'
				        });
				    }
				});
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	@import url(./logisticDetail.css);
</style>
